<!DOCTYPE html>
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@include file="../../common.jsp"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html lang="en">
    <head>        
    	<base href="<%=basePath%>">
        <!-- META SECTION -->
        <title>${htmlTitle}</title>            
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        
        <link rel="icon" href="favicon.ico" type="image/x-icon" />
        <!-- END META SECTION -->
        
        <!-- CSS INCLUDE -->        
        <link rel="stylesheet" type="text/css" id="theme" href="static/css/theme-default.css"/>
        <!-- EOF CSS INCLUDE -->      
        
        <link href="static/css/style.css" rel="stylesheet" type="text/css" media="all" />
		<link rel="stylesheet" href="static/css/jquery/lrtk.css" type="text/css" media="" />



		<script src="static/js/jquery/mosaic.1.0.1.js"></script>
		<script src="static/js/jquery/lrtk.js"></script>     
		
		<style type="text/css">
			.input-group {
			    min-width: 150px;
			}
		</style>
		                         
    </head>
    <body>
    
    	<%@include file="../../header.jsp"%>
    
        <!-- START PAGE CONTAINER -->
        <div class="page-container">
            
            <!-- START PAGE SIDEBAR -->
            	<%@include file="../../left.jsp"%>
            <!-- END PAGE SIDEBAR -->
            
            <!-- PAGE CONTENT -->
            <div class="page-content">

                <!-- START BREADCRUMB -->
                <!-- END BREADCRUMB -->                       
                
                <!-- PAGE CONTENT WRAPPER -->
                <div class="page-content-wrap">
					<div class="row">
						<div class="col-md-12" style="padding-top: 10px;">
							<!-- START SEARCH -->
							<div class="panel panel-default">
								<div class="panel-body">
									<div class="col-md-12" style="padding-left: 0px;">
										<div class="col-md-3">
											<div class="pull-left" style="line-height:30px;">停车场</div>
	                                		<div class="input-group" >
	                                           	<div class="input-group-btn">
	                                                 <select id="parkCode" class=" form-control select" >
													 </select>                                   
	                                            </div>
		                                    </div>
										</div>
										<div class="col-md-3">
											<div class="pull-left" style="line-height:30px;">车牌号</div>
	                                		<div class="input-group" >
	                                           	<div class="input-group-btn">
	                                                 <input id="plateNumber" type="text" class="form-control" value=""/>                                      
	                                            </div>
		                                    </div>
										</div>
										<div class="col-md-3" >
											<button class="btn btn-primary" onclick="search()">
												<span class="fa"></span>查询
											</button>
											<button class="btn btn-primary" onclick="clearCondition()">
												<span class="fa"></span>清空
											</button>
										</div>
									</div>
								</div>
							</div>
							<!-- END SEARCH -->
							
							<!-- START SEARCH RESULT -->
							<div class="search-results">
								<!-- START DEFAULT DATATABLE -->
								<div class="panel panel-default">
									<div class="panel-body">
										<table id="tableList" class="table table-hover "
											cellspacing="0" width="100%">
											<thead>
												<tr>
													<th style="width: 10%">
														停车场名称
													</th>
													<th style="width: 10%">
														车牌号
													</th>
													<th style="width: 10%">
														进场时间
													</th>
													<th style="width: 10%">
														出场时间
													</th>
													<th style="width: 10%">
														停车时长
													</th>
													<th style="width: 8%">
														车辆类型
													</th>
													<th style="width: 10%">
														放行操作
													</th>
													<th style="width: 8%">
														应付金额
													</th>
													<th style="width: 8%">
														优惠金额
													</th>
													<th style="width: 8%">
														实付金额
													</th>
													<th style="width: 8%">
														支付方式
													</th>
												</tr>
											</thead>
										</table>
									</div>
								</div>
								<!-- END DEFAULT DATATABLE -->
							</div>
						</div>
					</div>
                </div>
                <!-- END PAGE CONTENT WRAPPER -->                                
            </div>            
            <!-- END PAGE CONTENT -->
        </div>
        <!-- END PAGE CONTAINER -->
        
        <script type="text/javascript">
        	var table;
        	$(document).ready(function() {
        		queryList();
        		initParkOptions();
			});
        	
        	function initParkOptions() {
        		var url = ctx + '/vehicle/queryParkOptions';
				$.ajax(url, {
				    type: 'post',
				    data: {},
				    success: function(result){
				    	var rtn = JSON.parse(result);
				    	if (rtn.code==1) {
				    		$("#parkCode").html(rtn.options);
					    	$('#parkCode').selectpicker('refresh');
				    	} else {
				    		
				    	}
				    }
				});
        	}
        	
        	function search()
		 	{
		 		table.ajax.reload();
		 	}
        	
        	function queryList() {
        		table = $('#tableList').DataTable({
					processing :true,
					serverSide :true,
					bSort :false,
					bFilter :false, //过滤功能
					bAutoWidth: false,//自动宽度
					ajax : {
						"url" :ctx + "/record/queryOrderRecordList",
						"type" :"POST",
						"data": function(d){
						    return $.extend({}, d, {
						    	"parkCode": $("#parkCode").val(),//encodeURI(encodeURI($("#city").combobox('getValue'),"UTF-8")
							    "plateNumber":$("#plateNumber").val(),
							    "payChannel":"1"
						      });
						    }
					},
					columns : [
							{
								"data" :"parkName"
							}, {
								"data" :"plateNumber"
							}, {
								"data" :"enterTime"
							}, {
								"data" :"leaveTime"
							}, {
								"data" :"useTime"
							}, {
								"mDataProp": "carType",
								"fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
									if(sData == 1)
									{
										$(nTd).html("临时车");
									} else if(sData == 2) {
										$(nTd).html("月租车");
									} else if(sData == 3) {
										$(nTd).html("储值车");
									}
					            }	
							}, {
								"mDataProp": "releaseType",
								"fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
									if(sData == 1)
									{
										$(nTd).html("正常放行");
									} else if(sData == 2) {
										$(nTd).html("免费/异常放行");
									}
					            }		
							}, {
								"data" :"payableFee"
						    }, {
						    	"data" :"discountFee"
							}, {
								"data" :"paidFee"
							}, {
								"mDataProp": "payType",
								"fnCreatedCell": function (nTd, sData, oData, iRow, iCol) {
									if(sData == 1)
									{
										$(nTd).html("微信");
									} else if(sData == 2) {
										$(nTd).html("支付宝");
									} else if(sData == 3) {
										$(nTd).html("余额");
									} else if(sData == 4) {
										$(nTd).html("现金");
									}
								}
							}
						],
					columnDefs: [],
					"language" : {
						"lengthMenu" :"_MENU_ 条记录每页",
						"zeroRecords" :"没有找到记录",
						"info" :"第 _PAGE_ 页 ( 总共 _PAGES_ 页 )",
						"infoEmpty" :"无记录",
						"infoFiltered" :"(从 _MAX_ 条记录过滤)",
						"paginate" : {
							 "first":"首页",  
							 "last":"末页",     
							"previous" :"上一页",
							"next" :"下一页"
						}
					},
					"sPaginationType": "full_numbers"
				});
        	}
        	
        	function clearCondition()
		 	{
        		$("#parkCode").val("");
        		$('#parkCode').selectpicker('refresh');
        		$("#plateNumber").val("");
		 	}
        </script>
        
    </body>
</html>